<template>
  <div class="pop_container" v-if="visible" :style="isHarf ? { bottom: '30px' } : { top: '30px' }">
    <div style="position: relative">
      <h4>{{ title }}</h4>
      <div v-show="!isHarf" class="sm_p" :style="isAttr==1?{top: '-10px'}:{top: '-25px'}"></div>
    </div>
    <div>
      <slot></slot>
    </div>
    <div style="margin-top: 10px; float: right" v-show="showBtn">
      <a-button @click="$emit('update:visible', false)">取消</a-button>
      <a-button type="primary" @click="$emit('onSubmit')" style="margin-left: 10px">确认</a-button>
    </div>
    <div style="clear: both"></div>
    <div style="position: relative">
      <h4></h4>
      <div v-show="isHarf" class="sm_p" style="top: 15px"></div>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  props: {
    isAttr:{
      type:String,
      default:'0'
    },
    showBtn: {
      type: Boolean,
      default: true,
    },
    isHarf: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: '',
    },
    visible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {}
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  destroyed() {},
  updated() {},
  methods: {},
}
</script>

<style lang="less" scoped>
.pop_container {
  position: absolute;
  left: -143px;
  z-index: 1030;
  min-width: 300px;
  padding: 20px;

  background: #ffffff;
  border-radius: 2px;
  box-shadow: 0 0 10px rgba(128, 128, 128, 0.308);
}
.sm_p {
  width: 10px;
  height: 10px;
  background: #fff;
  position: absolute;
  left: 50%;
  transform: rotate(-45deg);
  z-index: 1031;
}
</style>